<template>
  <app-page card>
    <jax-form
      v-model="detail"
      :json="formJson"
      :form-props="{ 'label-width': '105px' }"
      ref="form"
      :style="'max-width:400px'"
    ></jax-form>
    <template #footer>
      <el-button type="primary" @click="handleSubmit">保存</el-button>
    </template>
  </app-page>
</template>

<script>
export default {
  mixins: [],
  data() {
    return {
      detail: {},
      form: {},
    }
  },
  computed: {
    formJson() {
      const required = true
      const miniInput = { style: 'width:100px' }

      const pwdInput = {
        attr: {
          maxlength: 12,
          minlength: 6,
        },
      }
      return [
        {
          type: 'password',
          name: 'originalPassword',
          label: '原始密码',
          required,
          // input: pwdInput,
        },
        {
          type: 'password',
          name: 'password',
          label: '新密码',
          required,
          // input: pwdInput,
        },
        {
          type: 'password',
          name: 'confirmPassword',
          label: '确认新密码',
          required,
          // input: pwdInput,
        },
      ]
    },
  },
  created() {},
  methods: {
    handleSubmit(e) {
      if (e) e.preventDefault()

      this.$refs.form
        .validate()
        .then(val => {
          let detail = {
            ...this.detail,
          }

          if (detail.confirmPassword != detail.password) {
            return this.$message.warning('新密码和确认密码不一致')
          }

          this.$http
            .post(
              `/system/user/modify-password`,
              {
                originalPassword: detail.originalPassword,
                password: detail.password,
              },
              { showLoading: '修改中...' }
            )
            .then(res => {
              this.$message.success('保存成功')
              this.detail = {}
              localStorage.clear()
            })
        })
        .catch(erros => {
          this.$message.warning(valid)
        })
    },
  },
}
</script>

<style lang="scss" scoped></style>
